<template>
  <van-card
    v-for="item in items"
    :key="item.id"
    :price="item.minPrice"
    :title="item.name"
    :thumb="item.pic"
    @click="clickItem(item.id)"
  >
    <template #footer>
      <van-icon
        name="gouwuchetianjia"
        @click.stop="addCart(item.id)"
        color="#ff623a"
        class-prefix="icon"
        size="20"
      />
    </template>
  </van-card>
</template>

<script setup lang="ts">
import type { Item } from "@/types/homeType";
import { useRouter } from "vue-router";
const router = useRouter();
defineProps<{
  items: Item[];
}>();

const emit = defineEmits(["addCart"]);
// 点击加入购物车图标
const addCart = (goodsId: number) => {
  emit("addCart", goodsId);
};
// 点击加入购物车按钮
const clickItem = (id: number) => {
  router.push({
    path: "/detail",
    query: {
      id,
    },
  });
};
</script>

<style scoped></style>
